<template>
  <a-modal
    :title="title"
    width="60%"
    :visible="visible"
    :footer="null"
    :confirmLoading="confirmLoading"
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭"
  >
    <a-card :bordered="false">
      <detail-list title="基本信息">
        <detail-list-item term="用户名">{{ model.userName==null?'无': model.userName}}</detail-list-item>
        <detail-list-item term="反馈内容">{{ model.content==null?'无': model.content }}</detail-list-item>
        <detail-list-item term="创建时间">{{ model.createTime }}</detail-list-item>
      </detail-list>
      <a-divider style="margin-bottom: 32px" />
    </a-card>
  </a-modal>
</template>

<script>
  import { getAction } from '@/api/manage'
  import DetailList from '@/components/tools/DetailList'
  const DetailListItem = DetailList.Item

  export default {
    name: 'templateDetails',
    components: {
      DetailList,
      DetailListItem
    },
    data() {
      return {
        visible: false,
        title: '详情',
        model: {},
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 }
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 }
        },

        confirmLoading: false,
        form: this.$form.createForm(this),
        url: {
          getDetails: '/feedback/queryById'
        }
      }
    },
    created() {},
    methods: {
      show(records) {
        let params = { id: records.id }
        this.visible = true
        this.$nextTick(() => {
          getAction(this.url.getDetails, params).then(res => {
            if (res.success) {
              this.model = res.result
            }
            if (res.code === 510) {
              this.$message.warning(res.message)
            }
          })
        })
      },
      close() {
        this.$emit('close')
        this.visible = false
      },
      handleOk() {
        this.close()
      },
      handleCancel() {
        this.close()
      }
    }
  }
</script>

<style lang="less" scoped></style>
